<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>数组去重</title>
</head>

<body>
  <!-- 
    数组去重: 根据当前数组产生一个去除重复元素后的新数组
          如: [2, 3, 2, 7, 6, 7] ==> [2, 3, 7, 6]
   -->
  <script>
    /*
    方法1: 利用forEach()和indexOf()
      说明: 本质是双重遍历, 效率差些
    */
    Array.prototype.unique = function () {
      const arr = []
      this.forEach(item => {
        if (arr.indexOf(item)===-1) {
          arr.push(item)
        }
      })
      return arr
    }

    /*
    方法2: 利用forEach() + 对象容器
    说明: 只需一重遍历, 效率高些
    */
    Array.prototype.unique2 = function () {
      const arr = []
      const obj = {}
      this.forEach(item => {
        if (!obj.hasOwnProperty(item)) {
          obj[item] = true
          arr.push(item)
        }
      })
      return arr
    }

    /*
    方法3: 利用ES6语法
        1). from + Set
        2). ... + Set
    说明: 编码简洁
    */
    Array.prototype.unique3 = function () {
      return Array.from(new Set(this))
    }
    Array.prototype.unique4 = function () {
      return [...new Set(this)]
    }
    
  </script>

  <script>
    console.log([2, 3, 2, 7, 6, 7].unique())
    console.log([2, 3, 2, 7, 6, 7].unique2())
    console.log([2, 3, 2, 7, 6, 7].unique3())
    console.log([2, 3, 2, 7, 6, 7].unique4())
  </script>
</body>

</html>